<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            height:2000px;
        }
        #search{
            background-color: #B2D0EF;
            padding:10px;
            position: absolute;
            top:100px;
        }
        #search input{
            width:500px;
            height:30px;

        }
    </style>
    <script>
        window.onscroll = function(){
            var h = document.documentElement.scrollTop;
            var d = document.getElementById("search").offsetTop;
            var div = document.getElementById("search");
            if(h>d+100){
                div.style.position = "fixed";
                div.style.top = "3px";
            }
        }
    </script>
</head>
<body>
<!--3(*,看情况实现):实现类似taobao搜索框的功能，当页面向下滚动，看不见搜素框的时候，把搜索框固定要页面顶端。-->
<div id="search">
    <input type="text" placeholder="search">
</div>
</body>
</html>